import React from 'react'
import { FieldBinaryOutlined, FieldNumberOutlined, FieldStringOutlined, FieldTimeOutlined, QuestionOutlined, TableOutlined, UnorderedListOutlined } from "@ant-design/icons"
import { Tooltip } from 'antd';

export const getSvgStringFromComponent = (AntdIconComponent) => {
    const icon = AntdIconComponent.render()?.props?.icon;

    // 处理属性
    const formatAttrs = (attrs = {}) => {
        return Object.entries(attrs)
            .map(([key, value]) => `${key}="${value}"`)
            .join(' ');
    };

    // 递归处理子节点
    const processNode = (node) => {
        if (!node) return '';

        const { tag, attrs = {}, children = [] } = node;
        const attributes = formatAttrs(attrs);
        const childContent = children.map(processNode).join('');

        // 自闭合标签处理（如没有children的path）
        if (children.length === 0 && !['defs', 'style'].includes(tag)) {
            return `<${tag} ${attributes}/>`;
        }
        if (tag === 'svg') {
            return `<${tag} xmlns="http://www.w3.org/2000/svg" ${attributes}>${childContent}</${tag}>`;
        }
        return `<${tag} ${attributes}>${childContent}</${tag}>`;
    };

    return processNode(icon?.icon);
}

export const FIELD_TYPE_MAP = {
    number: {
        icon: <FieldNumberOutlined style={{ color: '#2bc048' }} />,
        label: '数字',
        color: '#2bc048',
        presets: 'green',
        iconString: getSvgStringFromComponent(FieldNumberOutlined),
    },
    /**
     * 数值
     */
    binary: {
        icon: <FieldBinaryOutlined style={{ color: '#c02b62' }} />,
        label: '二进制',
        color: '#c02b62',
        presets: 'magenta',
        iconString: getSvgStringFromComponent(FieldBinaryOutlined),
    },
    string: {
        icon: <FieldStringOutlined style={{ color: '#2e74ff' }} />,
        label: '字符串',
        color: '#2e74ff',
        presets: 'geekblue',
        iconString: getSvgStringFromComponent(FieldStringOutlined),
    },

    date: {
        icon: <FieldTimeOutlined style={{ color: '#0a8ada' }} />,
        label: '时间',
        color: '#0a8ada',
        presets: 'blue',
        iconString: 'FieldTimeOutlined',
    },

    unknown: {
        icon: <QuestionOutlined style={{ color: 'orange' }} />,
        label: '未知',
        color: 'orange',
        presets: 'orange',
        iconString: 'QuestionOutlined',
    },
};

export const RESULT_SHOW_MODE = [
    {
        label: <Tooltip title='数据详情'>
            <TableOutlined />
        </Tooltip>,
        value: 'data',
    },
    {
        label: <Tooltip title='字段列表'>
            <UnorderedListOutlined />
        </Tooltip>,
        value: 'field'
    }
]

export const RESULT_SHOW_MODE_DICT = RESULT_SHOW_MODE.reduce((acc, cur) => {
    acc[cur.value] = cur.value
    return acc
}, {})

export const FIELD_TYPE_OPTIONS = [
    {
        label: '文本',
        value: 'string',
        icon: FIELD_TYPE_MAP.string.icon,
    },
    {
        label: '整数',
        value: 'number',
        icon: FIELD_TYPE_MAP.number.icon,
    },
    {
        label: '小数',
        value: 'decimal',
        icon: FIELD_TYPE_MAP.number.icon,
    },
    {
        label: '日期',
        value: 'date',
        icon: FIELD_TYPE_MAP.date.icon,
    },
    {
        label: '日期时间',
        value: 'datetime',
        icon: FIELD_TYPE_MAP.date.icon,
    },
    {
        label: '时间',
        value: 'time',
        icon: FIELD_TYPE_MAP.date.icon,
    },
]